// Mixins

@mixin clearfix {
  &::after {
    display: table;
    clear: both;
    content: '';
  }
}

//设置滚动条样式
@mixin base-scrollbar {
  // webkit滚动样式
  &::-webkit-scrollbar {
    width: 13px;
    height: 13px;
  }

  &::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.4);
    background-clip: padding-box;
    border: 3px solid transparent;
    border-radius: 7px;
  }

  &::-webkit-scrollbar-thumb:hover {
    background-color: rgba(0, 0, 0, 0.5);
  }

  &::-webkit-scrollbar-track {
    background-color: transparent;
  }

  &::-webkit-scrollbar-track:hover {
    background-color: #f8fafc;
  }
  // 火狐滚动条样式-不支持圆角设置
  & {
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.4) transparent;
  }

  &:hover {
    scrollbar-color: rgba(0, 0, 0, 0.4) #f8fafc;
  }
}

// 单行文本溢出
@mixin ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
